<template>
  <div class="reportDetailContainer">
    <el-form ref="form"  label-width="80px" style="margin: 40px">
      <el-form-item label="审核ID">
        <span>{{reportUId}}</span>
      </el-form-item>
      <el-form-item label="发布人">
        <a style="color: #006EFF" @click="toUserInfo">{{ reportUser.nickName }}</a>
      </el-form-item>
      <el-form-item label="发布时间">
        <span>{{ createTime }}</span>
      </el-form-item>
      <el-form-item label="文字内容">
        <div style="width: 600px;border: 1px solid #cccccc;tab-index: 1.5rem;line-height: 40px;padding: 10px">
          <span>{{linkDesc}}</span>
        </div>
      </el-form-item>
      <el-form-item label="图片内容">
        <div class="img">
          <el-image
            style="width: 100px; height: 100px"
            :src="srcList[0]"
            :preview-src-list="srcList">
            <div slot="error" class="image-slot">
            </div>
          </el-image>
        </div>
      </el-form-item>
      <el-form-item label="状态">
        <span >{{reportFlag}}</span>
      </el-form-item>
    </el-form>
    <div class="footerBtns" style="position: absolute;bottom: 20px;left: 50%">
      <el-button type="primary">下一个</el-button>
      <el-button type="danger" @click="delReport">删除</el-button>
      <el-button @click="cancel">取消</el-button>
      <el-button  type="success" @click="checkReport">驳回</el-button>
    </div>
  </div>
</template>

<script>
import { checkReport, deleteReport, getReportDetail } from '../../../../api/system/CompassDiaryReport'
import { delCommentReply } from '../../../../api/system/CompassDiary'

export default {
  name: 'AuditReportDetail',
  data(){
    return{
    //  审核人
      reportUId:"",
      reportUser:"",
      reportFlag:"",
      createTime:"",
      linkDesc:"",
      reportImg:"",
      reportId:"",
      userId:"",
      //缩略图
      srcList:[],
      //图片数据
      imgContent:[],
      imgUrl: [],
    }
  },
  created() {
    this.getReportDetail()
  },
  methods:{
    //跳转到个人详情页面
    toUserInfo(){
      const uid=this.userId
      this.$router.push({
        name:"UserDetail",
        query:{
          id:uid
        }
      })
    },
    //获取审核详细信息
    getReportDetail(){
      const id = this.$route.query.id;
      if(id){
        getReportDetail(id).then(res=>{
          this.reportUId=res.data.id
          this.reportUser=res.data.reportUser
          this.reportFlag=res.data.reportFlag
          this.createTime=res.data.createTime
          this.linkDesc=res.data.linkDesc
          this.reportId=res.data.id
          this.userId=res.data.reportUser.userId
          this.imgContent = res.data.fileList
          for(let imgUrl of this.imgContent){
            this.srcList.push(imgUrl.fileUrl)
          }
        })
      }
    },
  //  删除详细信息数据
    delReport() {
      const ids=this.reportId
      this.$confirm('是否确定删除编号为"' + ids + '"的数据项?', '警告', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(function() {
        return checkReport(ids,2)
      }).then(() => {
        this.$router.push("/diaryReport")
        this.msgSuccess('删除成功')
      }).catch(function() {
      })
    },
  //  驳回信息
    checkReport(){
      const ids=this.reportId
      this.$confirm('是否确定要驳回编号为"' + ids + '"的数据项?', '警告', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(function() {
        return checkReport(ids,1)
      }).then(() => {
        this.msgSuccess('驳回成功')
        this.$router.push("/diaryReport")
        this.getReportDetail()
      }).catch(function() {
      })
    },
    cancel(){
      this.$router.push("/diaryReport")
    }
  }
}
</script>

<style scoped lang="scss">

</style>
